*{
    padding: 0;
    margin: 0;
}
body,html{
    width: 100%;
    height: 100%;
}
// body
body{
    display: flex;
    flex-direction: column;
    background: #000d4a url(../imgs/bg.jpeg) no-repeat top ;
}
// .text{
//     width: 1rem /* 100/100 */;
//     height: 1rem /* 100/100 */;
//     background-color: red;
// }
header{
    height: 1.05rem /* 105/100 */;
    width: 100%;
    // background-color: red;
    position: relative;
    color: #fff;
    background: url(../imgs/head_bg.png) no-repeat center center;
    line-height: 1.05rem /* 105/100 */;
    h1{
        font-size: .42rem /* 42/100 */;
        text-align: center;
    }
    span{
        position: absolute;
        right: .2rem /* 20/100 */;
        top: 0rem;
        font-size:.2rem,
    }
}

section{
    flex:1;
    display: flex;
    justify-content: space-between;
    // background-color: blue;
    margin: .2rem /* 20/100 */;
    .column{
        width: 29%;
        height: 100%;
        .title{
        color: white;
        width: 100%;
        height: 0.35rem;
        float: left;
        font-size: 0.2rem;
    }
        // background-color: tomato;
        // 第一个column
        &:nth-of-type(1){
            .box{
                margin-bottom: .15rem /* 15/100 */;
                background-color: #000d4a;
                &:nth-child(1){
                    width: 100%;
                    height: 4rem /* 400/100 */;
                    .body{
                        height: 3.65rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                    }

                }
                &:nth-child(2){
                    width: 100%;
                    height: 2.6rem /* 260/100 */;
                    .nav{
                        width: 100%;
                        height: 0.25rem;
                        float: left;
                        
                        font-size: 0.18rem;
                        span{
                            width: 25%;
                            display: block;
                            float: left;
                        }
                    }
                    .body{
                        width: 100%;
                        height: 2rem;
                        font-size: 0.16rem;
                        float: left;
                        overflow: hidden;
                        ul{
                            height: 2.4rem;
                            float: left;
                            width: 100%;
                            li{
                                height: 0.4rem;
                                list-style: none;
                                span{
                                    display: block;
                                    height: 100%;
                                    float: left;
                                    width: 25%;
                                }
                            }
                        }
                    }

                }
                &:nth-child(3){
                    width: 100%;
                    height: 2.6rem /* 260/100 */;
                    .body{
                        height: 2.25rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                    }

                }
            }
        }

        // 第二个column
        &:nth-of-type(2){
            width: 40%;
            height: 100%;
            .title{
                color: white;
                width: 100%;
                height: 0.35rem;
                float: left;
                font-size: 0.2rem;
            }
            .box{
                margin-bottom: .15rem /* 15/100 */;
                background-color: #000d4a;
                &:nth-child(1){
                    height: 2.3rem /* 230/100 */;
                    // background-color: red;
                    .left{
                        width: 3.8rem;
                        height: 100%;
                        float: left;
                        .top{
                            height: 0.8rem;
                            line-height: 0.8rem;
                            color: white;
                            font-weight: 8rem;
                            border-bottom: 0.01rem solid white;
                            span{
                                font-size: 0.18rem;
                                margin-left: 0.15rem;
                            }
                        }
                        .bottom{
                            height: 1.5rem;
                            font-size: 0.7rem;
                            font-weight: border;
                            color: gold;
                            line-height: 1.5rem;
                        }
                    }
                    .right{
                        width: 3.4rem;
                        height: 2.3rem;
                        float: left;
                    }
                    
                }
                &:nth-child(2){
                    height: 3.5rem /* 350/100 */;
                    .body{
                        height: 3.15rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                    }
                }
                &:nth-child(3){
                    height: 3.4rem /* 340/100 */;
                    .body{
                        height: 3.05rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                    }
                }
            }
            
            
        }
       // 第三个column
        &:nth-of-type(3){
            color: white;
            .title{
                color: white;
                width: 100%;
                height: 0.35rem;
                float: left;
                font-size: 0.2rem;
            }
            .nav{
                text-align: center;
                width: 100%;
                height: 0.4rem;
                float: left;
                font-size: 0.18rem;
                border-bottom: 0.01rem solid white;
                span{
                    width: 25%;
                    display: block;
                    float: left;
                }
            }
            .box{
                margin-bottom: .15rem /* 15/100 */;
                background-color: #000d4a;
                &:nth-child(1){
                    height: 3rem /* 300/100 */;
                    .body{
                        height: 2.2rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                        ul{
                            width: 100%;
                            height: 100%;
                            li{
                                text-align: center;
                                height: 0.4rem;
                                width: 100%;
                                list-style: none;
                                font-size: 0.18rem;
                                span{
                                    display: inline-block;
                                    width: 24%;
                                    height: 100%;
                                    &:nth-child(1){
                                        u{
                                            display: inline-block;
                                            text-align: center;
                                            margin: 0.05rem;
                                            width: 0.3rem;
                                            height: 0.3rem;
                                            border-radius: 0.03rem;
                                            background-color: yellowgreen;
                                        }
                                        
                                    }
                                }
                                }
                            }
                    }
                    
                }
                &:nth-child(2){
                    height: 3rem /* 280/100 */;
                    .body{
                        height: 2.2rem;
                        width: 100%;
                        // background-color: red;
                        float: left;
                        ul{
                            width: 100%;
                            height: 100%;
                            li{
                                text-align: center;
                                height: 0.4rem;
                                width: 100%;
                                list-style: none;
                                font-size: 0.18rem;
                                span{
                                    display: inline-block;
                                    width: 24%;
                                    height: 100%;
                                    &:nth-child(1){
                                        u{
                                            display: inline-block;
                                            text-align: center;
                                            margin: 0.05rem;
                                            width: 0.3rem;
                                            height: 0.3rem;
                                            border-radius: 0.03rem;
                                            background-color: green;
                                        }
                                        
                                    }
                                   
                                }
                            }
                        }
                    }
                }
                &:nth-child(3){
                    height: 3.2rem /* 340/100 */;
                    .body{
                        height: 2.85rem;
                        width: 100%;
                        // background-color: red;
                        float: left;

                        
                    }
                }
            }

        }
    }
}